<template>
    <div>
        <el-col style="text-align:left">
        <div v-for="(discuss,index) in tableData.records" :key="discuss.id" :offset="index > 0 ? 0 : 0">
                <el-link :underline="false" style="font-size:12px" @click="change(discuss)">{{discuss.discussTitle}}</el-link><br>
                <span style="font-size:8px;color:rgb(179, 171, 171)">
                    <span style="color: rgb(54, 255, 4)">{{discuss.nickname}}</span> 
                    <el-divider direction="vertical"></el-divider>
                    {{discuss.createTime}}
                    <span style="margin-left:880px">回复数量:{{discuss.answer}}</span>
                </span>
                <el-divider content-position="left"></el-divider>  
        </div>
        <div>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="current"
            :page-size="page.pageSize"
            layout="total,prev, pager, next, jumper"
            :total="total">
        </el-pagination> 
        </div>
        </el-col>
        
    </div>
</template>

<script>

import {setCookie} from '@/libs/cookie'
import {getCookie} from '@/libs/cookie'
import {page} from "@/api/modules/forum";

export default {
    name:'discuss_content',
    data(){
        return{
            forum:{
              courseId:'',
              key:'',
              pageNum:null,
              type:'',
              title:''
            },
            page: {
                pageSize: 8,
                pageNum: 1,
            },
            loading: false,
            total:0,
            current: 1,
            tableData:[],
        }
    },
    mounted(){
         let forum = JSON.parse(getCookie("forum") || '{}');
         this.forum.type = forum.type
          this.forum.pageNum = forum.pageNum
           this.forum.title = forum.title
            this.forum.key = forum.key
         let courseID = JSON.parse(getCookie("courseID") || '{}');
            this.forum.courseId = courseID.courseID
          this.loadTableData()
    },
    methods:{

      change(discuss){
            setCookie("forumDiscuss", JSON.stringify(discuss), {
                         expires: 7
                     })
           this.$router.push("/teacher/discuss/answer");
        },

           //分页相关事件处理
      handleSizeChange(val) {
        this.page.pageSize = val;
        this.loadTableData()
      },
      handleCurrentChange(val) {
        this.page.pageNum = val;
        this.current = val
        this.loadTableData()
      },
       loadTableData(filter,callback){
          
            console.log(this.forum)
         this.forum.pageNum = this.page.pageNum
         this.forum.pageNum = this.page.pageNum
          filter = {
            ...filter,
            ...this.forum,
          }
          page(filter).then(res => {
            this.total = res.data.total
            this.tableData = {
              ...res.data,
              data: res.data.records
            }
            
            console.log(this.tableData)
          })
        },
    }
}
</script>

<style scoped>
.div{
    color: rgb(54, 255, 4);
}
</style>